
i[class*="icss-"] {
  position: relative;
  display:inline-block;
  font-style: normal;
  background-color:currentColor;
  box-sizing: border-box;
  vertical-align: middle;
}
i[class*="icss-"]:before, 
i[class*="icss-"]:after {
  content: "";
  border-width: 0; 
  position: absolute;
  box-sizing: border-box;
}

/* Size */
[class*="icss-"].xxsmall {
  font-size: .45em;
}
[class*="icss-"].xsmall {
  font-size: .5em;
}
[class*="icss-"].small {
  font-size: .65em;
}
[class*="icss-"].x1_5 {
  font-size: 1.5em;
}
[class*="icss-"].x2 {
  font-size: 2em;
}
[class*="icss-"].x2_5 {
  font-size: 2.5em;
}
[class*="icss-"].x3 {
  font-size: 3em;
}
[class*="icss-"].x4 {
  font-size: 4em;
}
[class*="icss-"].x5 {
  font-size: 5em;
}

/* Align text-bottom */
i[class*="icss-"].bottom {
  vertical-align:text-bottom;
}

/* flip */
.flip {
  transform: scaleX(-1);
}

/* rotate */
i[class*="icss-"].rot10 {
  transform: rotate(10deg);
}
i[class*="icss-"].rot-10 {
  transform: rotate(-10deg);
}
i[class*="icss-"].rot20 {
  transform: rotate(20deg);
}
i[class*="icss-"].rot-20 {
  transform: rotate(-20deg);
}
i[class*="icss-"].rot45 {
  transform: rotate(45deg);
}
i[class*="icss-"].rot-45 {
  transform: rotate(-45deg);
}
i[class*="icss-"].rot90 {
  transform: rotate(90deg);
}
i[class*="icss-"].rot-90 {
  transform: rotate(-90deg);
}
i[class*="icss-"].rot180 {
  transform: rotate(180deg);
}
i[class*="icss-"].rot-180 {
  transform: rotate(-180deg);
}

/* force animation */
i.icss-anim,
i.icss-anim:before,
i.icss-anim:after {   
  transition: all 1s;
}

/* Spin */
.icss-spin {
  animation: spin 2s infinite linear;
}
.icss-pulse {
  animation: spin 1s infinite steps(8);
}

.icss-spin-hover:hover {
  animation: spin 2s infinite linear;
}

@keyframes spin {
  0% {
    transform: rotate(0deg);
  }
  100% {
    transform: rotate(359deg);
  }
}

/* BELL */
@keyframes ring {
	0%{transform:rotate(-15deg)}
	2%{transform:rotate(15deg)}
	4%{transform:rotate(-18deg)}
	6%{transform:rotate(18deg)}
	8%{transform:rotate(-22deg)}
	10%{transform:rotate(22deg)}
	12%{transform:rotate(-18deg)}
	14%{transform:rotate(18deg)}
	16%{transform:rotate(-12deg)}
	18%{transform:rotate(12deg)}
	20%,100%{transform:rotate(0deg)}
}

.icss-ring {
  animation: ring 2s infinite ease;
}
.icss-ring-hover:hover {
  animation: ring 2s infinite ease;
}

/* VERTICAL */
@keyframes vertical {
	0%{transform:translate(0,-3px)}
	4%{transform:translate(0,3px)}
	8%{transform:translate(0,-3px)}
	12%{transform:translate(0,3px)}
	16%{transform:translate(0,-3px)}
	20%{transform:translate(0,3px)}
	22%,100%{transform:translate(0,0)}
}
.icss-vibes,
.icss-vibes-hover:hover {
	animation: vertical 2s ease infinite;
}

/* HORIZONTAL */
@keyframes horizontal {
	0%{transform:translate(0,0)}
	6%{transform:translate(5px,0)}
	12%{transform:translate(0,0)}
	18%{transform:translate(5px,0)}
	24%{transform:translate(0,0)}
	30%{transform:translate(5px,0)}
	36%,100%{transform:translate(0,0)}
}
.icss-shake,
.icss-shake-hover:hover {
	animation: horizontal 2s ease infinite;
}

/* TADA */
@keyframes tada {
	0% {transform: scale(1)}
	10%,20% {transform:scale(.9) rotate(-8deg);}
	30%,50%,70% {transform:scale(1.3) rotate(8deg)}
	40%,60% {transform:scale(1.3) rotate(-8deg)}
	80%,100% {transform:scale(1) rotate(0)}
}

.icss-tada,
.icss-tada-hover:hover{
	animation: tada 2s linear infinite;
}

/* Reverse animation */
.icss-reverse {
  animation-direction: reverse;
}
[class*="-hover"].icss-reverse:hover {
  animation-direction: reverse;
}

/* Stack icons */
.icss-stack {
  position: relative;
  width: 1em;
  height: 1em;
  display: inline-block;
}

.icss-stack i[class*="icss-"] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-.5em, -.5em);
}

.icss-stack i[class*="icss-"].bottom {
  bottom: 0;
  top: auto;
}

/* shadow icon */
.icss-shadow {
  position: relative;
  width: 1em;
  height: 1em;
  display: inline-block;
}

.icss-shadow i[class*="icss-"] {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-.5em, -.5em);
}

.icss-shadow i[class*="icss-"]:first-child {
  top: 54%;
  left: 54%;
}
